<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- form标签，表单要能传值就要用这个包裹 -->
     <h2>表单标签使用</h2>
    <form action="https://www.baidu.com/s">
        <div><input type="text" placeholder="请输入用户名" name="username"></div>
        <div><input type="password" placeholder="请输入密码" name="password"></div>
        <div>
            <!-- 
                input标签中的name代表分组,name相同就是一组
                label标签的for中与input中的id关联，实现点字等同于点标签
             -->
            <input id="boy" type="radio" name="sale">
            <label for="boy">男</label>

            <input id="male" type="radio" name="sale">
            <label for="male">女</label>

            <input id="qita" type="radio" name="sale">
            <label for="qita">其他</label>
        </div>
        <div>
            <!-- 复选框 -->
            <input id="sign" type="checkbox">
            <label for="sign">唱</label>

            <input id="dance" type="checkbox">
            <label for="dance">跳</label>

            <input id="rap" type="checkbox">
            <label for="rap">rap</label>

            <input id="basketball" type="checkbox">
            <label for="basketball">篮球</label>
        </div>

        <div>
            <textarea placeholder="个性签名" name="" id=""></textarea>
        </div>

        <div>
            <!-- 
                submit的按钮，提交时，是提交到form标签的action中，需要为表单设置key，也就是name属性
             -->
            <button type="submit">提交</button>
            <button type="reset">重置</button>
        </div>
    </form>

    <form action="https://www.baidu.com/s">
        <input type="text" name="wd" id="">
        <button type="submit">搜索</button>
    </form>
</body>
</html>